<template>
  <div class="workbenchBox">
    <div class="title not">
      <h3>数据统计</h3>
    </div>
    <div class="statisticsList">
      <ol class="list list_4">
        <dl>
          <dt>今日业务订单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.todaysSaleOrderCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>今日生产下单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.todaysProduceTaskCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>今日交货订单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.todaysProduceFinishOrderCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>今日采购订单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.todaysPurchaseOrderCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>今日停工订单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.todaysProduceStopOrderCount || "--" }}</h3>
              <span class="unit">个</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>未生产订单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.noProduceTaskOrderCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>即将到期订单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.aboutToExpireOrderCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>超期订单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.deliveryOverDueOrderCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>客户总数量</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.customerCount || "--" }}</h3>
              <span class="unit">个</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>员工总数量</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.employeeCount || "--" }}</h3>
              <span class="unit">个</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>供应商数量</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.supplierCount || "--" }}</h3>
              <span class="unit">个</span>
            </div>
          </dd>
        </dl>
        <dl>
          <dt>物料总数</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.goodsCount || "--" }}</h3>
              <span class="unit">个</span>
            </div>
          </dd>
        </dl>
      </ol>
    </div>
    <div class="title not">
      <h3>待办事项</h3>
    </div>
    <div class="statisticsList">
      <ol class="list list_4 hover">
        <dl @click="handleUpload">
          <dt>待彩稿上传</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.waitUploadColorDraftCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl @click="handleExamine">
          <dt>待彩稿审核</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.waitCheckColorDraftCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl @click="handleIssue">
          <dt>待发料出库</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.waitOutStockLldCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
        <dl @click="handleRetreat">
          <dt>待退料入库</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.waitInStockTldCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
      </ol>

      <ol class="list list_12 hover">
        <dl @click="handleProduction">
          <dt>待生产开单</dt>
          <dd>
            <div class="number">
              <h3>{{ formData.noProduceTaskOrderCount || "--" }}</h3>
              <span class="unit">单</span>
            </div>
          </dd>
        </dl>
      </ol>
    </div>
    <div class="title not">
      <div class="title-describe">
        <h3>快速上手</h3>
        <p>第一次使用，需要您按如下顺序进行初始化设定</p>
      </div>
    </div>
    <div class="guideBox">
      <div class="items" v-for="(item, index) in tabData" :key="index">
        <div class="tit">
          <span>{{ index + 1 }}</span>
          <h3>{{ item.name }}</h3>
        </div>
        <ul>
          <li
            v-for="(i, k) in item.hrefData"
            :key="k"
            @click="handleClickItem(i)"
          >
            {{ i.title }}
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tabData: [
        {
          name: "系统设置",
          hrefData: [
            {
              title: "基础数据",
              url: "/system/baseData",
            },
            {
              title: "工艺设置",
              url: "/system/craftConfig",
            },
            {
              title: "设备设置",
              url: "/system/deviceConfig",
            },
            {
              title: "颜色设置",
              url: "/system/colorConfig",
            },
            {
              title: "班次设置",
              url: "/system/ShiftConfig",
            },
            {
              title: "角色权限",
              url: "/system/rolePermission",
            },
          ],
        },
        {
          name: "仓库设置",
          hrefData: [
            {
              title: "仓库管理",
              url: "/warehouse/warehouseStting/wareManage",
            },
            {
              title: "供应商管理",
              url: "/warehouse/warehouseStting/supplier",
            },
            {
              title: "物料管理",
              url: "/warehouse/warehouseStting/materiel",
            },
          ],
        },
        {
          name: "生产设置",
          hrefData: [
            {
              title: "设备工艺",
              url: "/production/productSetup/equipmentProcess",
            },
            {
              title: "表面要求",
              url: "/production/productSetup/surfaceRequirements",
            },
            {
              title: "材料管理",
              url: "/production/productSetup/materialManagement",
            },
            {
              title: "标签工艺",
              url: "/production/productSetup/titleProcess",
            },
          ],
        },
        {
          name: "业务设置",
          hrefData: [
            {
              title: "客户汇总",
              url: "/business/customerSummary",
            },
          ],
        },
        {
          name: "员工设置",
          hrefData: [
            {
              title: "人事管理",
              url: "/personnel/personnelManage",
            },
          ],
        },
      ],
      formData: "",
    };
  },
  created() {
    this.getDetailData();
  },
  mounted() {},
  methods: {
    //链接跳转
    handleClickItem(item) {
      this.$router.push({
        path: item.url,
      });
    },

    //彩稿上传
    handleUpload() {
      this.$router.push({
        path: "/business/colorManuscriptUpload",
      });
    },

    //彩稿审核
    handleExamine() {
      this.$router.push({
        path: "/business/colorDraftReview",
      });
    },
    //发料出库
    handleIssue() {
      this.$router.push({
        path: "/warehouse/exWarehouse/pickingOut",
      });
    },

    //退料入库
    handleRetreat() {
      this.$router.push({
        path: "/warehouse/inStock/returnMaterial",
      });
    },

    //生产开单
    handleProduction() {
      this.$router.push({
        path: "/production/productionOrder",
      });
    },

    //获取数据
    getDetailData() {
      this.$api.report.ExportOutStockReportsDataToExcel().then((res) => {
        this.formData = res;
      });
    },
  },
};
</script>

<style lang="scss" scoped>

.hover>dl{
  cursor: pointer;
}
</style>
